import React, { useState, useEffect, useRef } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { EdrmsTypeStyle } from './style';
import * as echarts from 'echarts/core';
import EdrmsTypePie from './EdrmsTypePie';
import EdrmsTypeRankItem from './EdrmsTypeRank';
import { RootState } from '@/store';
import { MainState } from '@/store/reducers/main';
import { EdrmsTypeDto } from '@/services/types';
import { getEdrmsTypeList } from '@/services';
type EdrmsTypePropsType = {

};
const BorrowCount = () => {

    // const { edrmsTypeDto } = useSelector<RootState, MainState>((state) => {
    //     return state.main
    // });
    const [edrmsTypeData, setEdrmsTypeData] = useState<EdrmsTypeDto>({});

    useEffect(() => {
        getEdrmsTypeList().then(res => {
            if(res) {
               setEdrmsTypeData(res);
            }
        });

    }, []);

    useEffect(() => {

    }, [edrmsTypeData]);

    return (
        <EdrmsTypeStyle>
            <div className="edrmstype" style={{ "display": "flex" }}>
                <div style={{ "width": "50%" }}>
                    <EdrmsTypePie data={edrmsTypeData || {}}></EdrmsTypePie>
                </div>
                <EdrmsTypeRankItem data={edrmsTypeData || {}}></EdrmsTypeRankItem>
            </div>
        </EdrmsTypeStyle>
    );
};

export default BorrowCount;
